<template>
  <z-modal
    :width="1200"
    title="权限资源"
    v-bind="modalOption"
    @cancel="handleCancel"
    :okButtonProps="{ class: '!hidden'}"
  >
    <vxe-grid
      id="ResDataList"
      ref="vxeTable"
      v-bind="gridOptions"
      v-on="listeners"
      :pager-config="false"
      :row-config="{keyField:'id'}"
    >
      <template #action="{ row }">
        <a @click="handleEdit(row)">编辑</a>
        <a-divider type="vertical" />
         <a-dropdown>
          <a class="ant-dropdown-link">
            更多 <a-icon type="down" />
          </a>
          <a-menu slot="overlay">
            <a-menu-item v-if="row.hasCriteria">
              <a @click="handleFilter(row)">过滤权限设置</a>
            </a-menu-item>
            <a-menu-item>
              <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(row.id)">
                <a>删除</a>
              </a-popconfirm>
            </a-menu-item>
          </a-menu>
        </a-dropdown>
      </template>
    </vxe-grid>
    <AuthorityResModal ref="modalForm" @ok="modalFormOk" :parentId="parentId" />
    <DataFilterListModal ref="dataFilterListModal" @ok="modalFormOk" />
  </z-modal>
</template>

<script>
import ModalFormMixin from '@/mixins/ModalFormMixin'
import VxeTableListMixin from '@/mixins/VxeTableListMixin'
import AuthorityResModal from './AuthorityResModal'
import DataFilterListModal from './DataFilterListModal'
export default {
  name: 'AuthorityResListModal',
  mixins: [ModalFormMixin, VxeTableListMixin],
  components: { AuthorityResModal, DataFilterListModal },
  data() {
    return {
      columns: [
        { type: 'seq', width: 40 },
        { title: '名称', field: 'title' },
        { title: '路径', field: 'path' },
        { title: '数据资源类别', field: 'hasCriteria', slots: { default: ({ row }) => {
          if (row.hasCriteria === true) {
            return '可过滤'
          }
          return '不可过滤'
        } }},
        { title: '权限标识', field: 'elementId' },
        { title: '描述', field: 'description' },
        {
          title: '操作',
          slots: { default: 'action' },
          width: 170
        }
      ],
      url: {
        list: '/res/data/list/',
        delete: '/res/data/remove/',
        deleteBatch: '/res/data/remove/'
      },
      proxyConfig: {
        autoLoad: false
      },
      toolbarConfig: {
        import: false,
        export: false
      },
      parentId: ''
    }
  },
  methods: {
    show(row) {
      this.url.list = '/res/data/list/' + row.id
      this.parentId = row.id
      this.visible = true
      this.loadData()
    },
    handleFilter(row) {
      this.$refs.dataFilterListModal.show(row)
    }
  }
}
</script>

